import React from 'react';
import { observer, inject } from 'mobx-react';
import { TabPage } from 'weaver-mobile-page';
import Footer from '../home/Footer';
import TabCont from './TabCont';
import { FROMWEITETABKEYS } from '../../../constants/form';
import { getRequest } from '../../../common/getRequest';
import './index.less';
import { Tools } from 'weaver-mobile';
const getLabel = Tools.getLabel;
const tabs = [{key: FROMWEITETABKEYS.NOFILLED, title: getLabel(526990,'待填写') }, {key: FROMWEITETABKEYS.FILLED, title: getLabel(526991,'填写历史')}];

@inject('writeStore')
@observer
export default class FormWrite extends React.Component {
  constructor(props) {
    super(props);

    this.store = props.writeStore;
    this.state = { tabKey: FROMWEITETABKEYS.NOFILLED };

    if (getRequest().backBtnAble === 'true') {
      window.backBtnAble = true;
    }
  }

  componentDidMount() {
    this.store.init();
  }

  tabProps = {
    onChange: tab => {
      this.setState({ tabKey: tab.key });
    }
  };

  render() {
    const { tabKey } = this.state;

    return (
      <div className='wea-edc-mobile-form-write'>
        <TabPage 
          tabs={tabs}
          tabProps={this.tabProps}
        />
        <TabCont 
          key={FROMWEITETABKEYS.NOFILLED}
          _key={FROMWEITETABKEYS.NOFILLED} 
          visible={tabKey === FROMWEITETABKEYS.NOFILLED}
        />
        <TabCont 
          key={FROMWEITETABKEYS.FILLED}
          _key={FROMWEITETABKEYS.FILLED} 
          visible={tabKey === FROMWEITETABKEYS.FILLED}
        />
        <Footer />
      </div>
    )
  }
}